/*
 * 预约看房明细
 * @author 雷鸣
 * @time 2018/9/22
 * @since 1.0.0
 * */
// React基础组件
import React from 'react'
// dva 连接组件 - 连接route和model
import { connect } from 'dva'
// 引入antd的组件
import { Form, Select, Input, DatePicker, Button } from 'antd'
import moment from 'moment';
const { RangePicker } = DatePicker;
const dateFormat = 'YYYY/MM/DD';
//导入路由组件，用于跳转等
import { Link, hashHistory } from 'dva/router'
// 导入项目全局配置文件
import config from 'config/config'

// 引入model取值工具方法
import { mapStateToProps } from 'utils/view_utils'
// 当前组件样式
import styles from './bookingDetailStyle.less'
//引用listPage
import ListPage from 'widget/PageTmpl/ListPage'
import cx from 'classnames'

const Option = Select.Option;
/**
 * description 路由视图及事件处理
 * dispatch 分发到models中的effects对应事件名
 * model 用于获取models中state定义的数据
 * form 表单对象
 */

const infoListAdminView = function ({ dispatch, model, form }) {
  // 表单的子函数
  const { resetFields, getFieldDecorator, validateFields, setFieldsValue } = form
  // 取出model对象，命名空间
  const { modelObj, namespace } = model
  const { productId, productName, date } = modelObj;

  // modelObj.xxx获取model中状态机的值

  // 详情页跳转
  function detailSkip(id) {
    // console.log(Id)
    hashHistory.push({
      pathname: '/home/bookingAdmin/bookingDetail',
      query: { bookingId: id }
    });
  }
  //导出列表
  function exportList() {
    console.log(222)

  }

  let pageProps = {
    // ---------- 界面部分 ----------
    "ui": {
      // 页面接口地址
      "api_url": "admin/appointmentHouse/queryAppointmentHouseDetail",
      // 接口方式
      "method": "POST",
      "app": "",
      // 接口参数
      "params": "productId=" + productId + "&pageNo=1&pageSize=10",
      // 模拟数据 - 用于开发需要，若填充了上面的api_url之后，请将此项设置为null
      // "mockData": mockData,
      "mockData": null,
      // 数据表格
      "table":
      {
        "status_params": "status=0",
        "status_text": "全部",
        // 表头字段列表
        "scroll": { x: 1000 },
        "fields": [
          {
            "en_name": "name",
            "zh_name": "客户姓名",
          },
          {
            "en_name": "mobile",
            "zh_name": "联系方式",
          },
          {
            "en_name": "appointmentTime",
            "zh_name": "看房时间",
            render:(a, item, index, d, e, f) => {
              return (
                <span>{(item.appointmentTime||'').substr(0,10)}</span>
              )
            }
          },
          {
            "en_name": "counselorId",
            "zh_name": "置业顾问编号",
          },
          {
            "en_name": "counselorName",
            "zh_name": "置业顾问",
          }
        ]
      },
      // "action_bar": [{
      //   label: '导出',
      //   type: 'primary',
      //   onClick: (e, row) => {
      //     exportList("add")
      //   }
      // }]
    },
  }

  return (

    <div className={cx('pageLayout')}>
      <div style={{
        width: '100%', background: '#fff', height: '72px', display: 'flex',
        justifyContent: 'flex-start', alignItems: 'center', marginBottom: '24px', padding: '30px',
        borderRadius: '6px', boxShadow: '0 0 10px 0 rgba(48, 48, 50, 0.05)'
      }}>
        <div >
          <div style={{ fontSize: '16px', color: '#2b2b2b', marginRight: '42px' }}><span style={{ color: '#ccc' }}>项目名称：</span>{productName}</div>

        </div>
        {/* <div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center' }}>
          <div style={{ marginRight: '54px', fontSize: '16px' }}>
            <span style={{ color: '#ccc' }}>预约日期：</span>{date}
          </div>
        </div> */}
      </div>
      <ListPage pageProps={pageProps} />
    </div>
  )
}

// 连接视图(view)和模型(model)
export default connect(mapStateToProps)(Form.create()(infoListAdminView))
